<template>
    <el-tooltip class="item" effect="dark" placement="top-start" style="margin-left: -115px">
      <div slot="content">
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-blue"></i>商铺</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-yellow"></i>活动空间</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-red"></i>消防通道</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-green"></i>楼道</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-orange"></i>办公室</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-balck"></i>仓库</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-sgrea"></i>会议室</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-purple"></i>写字楼</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-lightBlue"></i>其他</div>
        <div class="align-center font-size-12"><i class="icon el-icon-location font-size-20 bg-ccc"></i>禁用</div>
      </div>
      <i class="el-icon-warning font-size-18"></i>
    </el-tooltip>
</template>

<script>
  export default {
    name: 'type-tips',
    props: {},
    data() {
      return {};
    },
    methods: {},
  };
</script>

<style lang="scss" scoped>
  .bg-blue {
    color: rgb(9, 9, 233) !important;
  }
  .bg-yellow {
    color: rgb(228, 214, 20) !important;
  }
  .bg-red {
    color: rgb(243, 80, 4) !important;
  }
  .bg-green {
    color: rgb(94, 236, 12) !important;
  }
  .bg-orange {
    color: rgb(157, 202, 216) !important;
  }
  .bg-black {
    color: rgb(34, 34, 31) !important;
  }
  .bg-sgrea {
    color: rgb(107, 72, 31) !important;
  }
  .bg-purple {
    color: rgb(249, 0, 240) !important;
  }
  .bg-lightBlue {
    color: rgb(105, 105, 210) !important;
  }
  .bg-ccc {
    color: #cccccc !important;
  }
</style>
